<template>
    <div class="department">
        <div class="search">
            <el-button type="primary" @click="add">添加职务</el-button>
        </div>

        <div class='content'>
            
            <el-dialog :title="dialogtitle" :visible.sync="centerDialogVisible" width="60%" center @close="dialogclose">
                <el-form :model="form" :rules="rules" ref="form" label-width="140px" class="demo-ruleForm" inline size="mini">
                    <el-form-item label="职务名称" prop="p_name">
                        <el-input v-model="form.p_name" placeholder="请输入职务名称"></el-input>
                    </el-form-item>
                    <!-- authories为该部门或者该员工的权限（添加职务时为空）   permissionId: 被修改的id（添加职务时为0）  typeid:1为部门，2为员工，3为添加职务，4为修改职务  -->
                    <Permission v-if="dialogtitle == '添加职务'" authories="" permissionId="" typeid="3" @refreshlistevent="refreshlistievent" />
                </el-form>

                <span slot="footer" class="dialog-footer" v-if="dialogtitle != '添加职务'">
                    <el-button @click="cancel('form')" size="mini">取 消</el-button>
                    <el-button type="primary" @click="submit('form')" size="mini">确 定</el-button>
                </span>
            </el-dialog>
            <!-- 列表 -->
            <div class='list'>
                <el-table :data="list.data" ref="listTable" tooltip-effect="dark" style="width: 100%" @row-click="showauthories" highlight-current-row>

                    <el-table-column align="center" prop="p_name" label="职务"></el-table-column>
                    <el-table-column align="center" prop="created_at" label="创建时间"></el-table-column>
                    <el-table-column align="center" prop="updated_at" label="修改时间"></el-table-column>
                    <el-table-column align="center" fixed="right" label="操作">
                    <template slot-scope="scope">
                        <el-button @click.native.prevent="edit(scope.row)" type="text" size="small">编辑</el-button>
                        <el-button @click.native.prevent="deltest(scope.row)" type="text" size="small" :disabled="scope.row.u_type == 2">删除</el-button>
                    </template>
                    </el-table-column>
                </el-table>
                <!-- 分页 -->
                <el-pagination :current-page="current" @current-change="handleCurrentChange" :total="list.total" style="margin-top:30px;"></el-pagination>
            </div>
            <!-- authories为该部门或者该员工的权限   permissionId: 被修改的id  typeid:1为部门，2为员工，3为添加职务，4为修改职务  -->
            <Permission v-if="showPermission" :authories="authories" :permissionId="dutiesId" typeid="4" @refreshlistevent="refreshlistievent" />
        </div>
    </div>
</template>
<style>
    .home .view-content{
        width: 87%;
    }
    .el-form-item__label,.el-form-item__content{
        font-size: 12px;
    }
    .el-input{
        padding-right: 5px;
    }
    .el-select-dropdown__item{
        font-size: 12px;
        padding: 0px 10px;
        height: 26px;
        line-height: 26px;
    }
    .el-input,.el-date-editor.el-input{
        width: 145px;
    }
</style>

<script>
    import conf from '../../config/userconf.js'
    import permconfig from "../../config/permconfig.js"
  export default {
    data() {
        return {
            list:[],
            form:{
                p_name:'',
            },
            rules:{
                p_name: [
                    { required: true, message: '请输入职务名称', trigger: 'blur' }
                ],
            },
            dialogtitle:'添加职务',
            centerDialogVisible:false,
            current: 1,  //当前页码
            showPermission: false,  //是否拥有设置权限     
            authories: '',  //所拥有的权限
            dutiesId: '',  //职务id
        }
    },
    methods: {
        //接收  子组件事件  
        refreshlistievent(authories,type,data=Object(),batchdata=Object()){
            // console.log(authories,type);
            //
            if(type == 3){  //添加职务权限
                if(!this.form.p_name){
                    this.$message({
                        type: 'info',
                        message: '请输入职务名称'
                    });
                }else{
                    data.p_name = this.form.p_name;
                    data.p_authories = authories;
                    conf.duties.add(data,(state,res)=>{
                        if (state == 'success'&&res.data.code == 0){
                            this.getList();
                            this.centerDialogVisible = false;
                            this.$message({
                                type: 'success',
                                message: '添加成功!'
                            });
                            //初始化
                            this.form.p_name = '';
                        }else if(state == 'success'&&res.data.code != 0){
                            if(res.data.code == 401){
                                this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                            }else{
                                this.$message({
                                    type: 'info',
                                    message: res.data.msg
                                });
                            }
                        }
                    })
                }
            }else if(type == 4){  //修改职务权限
                let batchid = this.dutiesId;
                data.p_id = this.dutiesId;
                data.p_authories = authories;
                conf.duties.edit(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        this.getList();
                        this.centerDialogVisible = false;
                        this.$message({
                            type: 'success',
                            message: '修改成功!'
                        });
                        //初始化
                        this.form.p_name = '';
                        this.$confirm('是否将权限同步到该职务下所有员工?', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(() => {
                            batchdata.id = batchid;
                            conf.duties.batchedit(batchdata,(state,res)=>{
                                if (state == 'success'&&res.data.code == 0){
                                    this.$message({
                                        type: 'success',
                                        message: '同步成功!'
                                    });
                                }else if(state == 'success'&&res.data.code != 0){
                                    if(res.data.code == 401){
                                        this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                                    }else{
                                        this.$message({
                                            type: 'info',
                                            message: res.data.msg
                                        });
                                    }
                                }
                            })
                            
                        }).catch(() => {
                            this.$message({
                                type: 'info',
                                message: '已取消同步'
                            });          
                        });

                    }else if(state == 'success'&&res.data.code != 0){
                        if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            }
        },
        /* 列表*/
        getList (data=Object()){

            data.page = this.current;
            conf.duties.list(data,(state,res)=>{
                if (state == 'success'&&res.data.code == 0){
                    // console.log(res);
                    this.list = res.data.data;
                    //有职务时，默认展示第一个职务权限
                    if(this.list.data.length > 0){
                        this.$refs.listTable.setCurrentRow(this.list.data[0]); //默认高亮列表表格第一行
                        this.authories = this.list.data[0].p_authories;
                        this.dutiesId = this.list.data[0].p_id;
                        //子组件重新渲染
                        this.showPermission = false;
                        this.$nextTick(function () {
                            this.showPermission = true; 
                        });
                    }else{
                        this.showPermission = false;
                    }
                }else if(state == 'success'&&res.data.code != 0){
                    if(res.data.code == 401){
                        this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                    }else if(res.data.code == -404){
                        this.list = [];
                    }else{
                        this.$message({
                            type: 'info',
                            message: res.data.msg
                        });
                    }
                }
            })
        },
        /*取消 */
        cancel (formName) {
            this.$refs[formName].resetFields();
            this.centerDialogVisible = false; 
        },
        /*提交 */
        submit (formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.judgeprimise();
                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        },
        /*判断提交 */
        judgeprimise (data=Object()) {
            if (this.dialogtitle == '添加职务') {
                data.p_name = this.form.p_name;
                data.p_authories = this.authories;
                conf.duties.add(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        this.getList();
                        this.centerDialogVisible = false;
                        this.$message({
                            type: 'success',
                            message: '添加成功!'
                        });
                        //初始化
                        this.form.p_name = '';
                    }else if(state == 'success'&&res.data.code != 0){
                        if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            }else if (this.dialogtitle == '修改职务信息'){
                data.p_id = this.dutiesId;
                data.p_name = this.form.p_name;
                conf.duties.edit(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        this.getList();
                        this.centerDialogVisible = false;
                        this.$message({
                            type: 'success',
                            message: '修改成功!'
                        });
                        //初始化
                        this.form.p_name = '';
                    }else if(state == 'success'&&res.data.code != 0){
                        if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            }
        },
        /*增 */
        add (formName) {
            this.dialogtitle = '添加职务';
            this.centerDialogVisible = true;
        },
        // 删除职务
        deltest (row,data=Object()) {
            // console.log(row);
            this.$confirm('确认删除职务"'+row.p_name+'" ?', '删除职务', {  
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {

                data.p_id = row.p_id;
                conf.duties.del(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        this.getList();
                        this.$message({
                            type: 'success',
                            message: '删除成功!'
                        });
                    }else if(state == 'success'&&res.data.code != 0){
                        if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })

            }).catch(() => {
                this.$message({
                  type: 'info',
                  message: '已取消删除'
                });          
            });
        },
        /**改*/
        edit (val) {
            // console.log(val.p_name);
            this.dialogtitle = '修改职务信息';
            this.form.p_name = val.p_name;
            this.dutiesId = val.p_id;
            this.authories = val.p_authories;
            this.centerDialogVisible = true;
        },
        // 切换页码
        handleCurrentChange(val) {
            this.current = val;
            this.getList();
        },
        //单击当前行
        showauthories(row, event, column){
            // console.log(row.p_authories);
            this.authories = row.p_authories;
            this.dutiesId = row.p_id;
            //子组件重新渲染
            this.showPermission = false;
            this.$nextTick(function () {
                this.showPermission = true; 
            });
        },
        //关闭弹框
        dialogclose(){
            this.$refs['form'].resetFields();
        },
    },
    mounted (){
        this.$nextTick(function(){
            this.getList();
        })
    },
        
  }
</script>